/**
 * Clone An All-New Element From the Given One.
 * @param {HTMLElement} elem 
 */
function clone(elem){
    var parent = document.createElement("div");
    parent.append(elem.cloneNode(true));
    var child = parent.children[0];
    if(child) child.remove();
    parent = null;
    return child;
}
var template = document.getElementById("template");
function renderIntoTree(telem, id, hasChildren){
    var treeElem = getTree(telem);
    var t = clone(template);
    t.id = "";
    console.log(t);
    t.className = 'w-item';
    t.dataset.href = id;
    var i = t.querySelector("input[type='checkbox']");
    var l = t.querySelector(".w-title");
    var tr = t.querySelector(".w-tree");
    if(!hasChildren){
        i.remove();
        tr.remove();
        l.dataset.editable = 'true';
    }
    l.innerText = id;
    var c = [...treeElem.children];
    if(c[c.length - 1] && c[c.length - 1].dataset.type === "Button-ADD")
        c[c.length - 1].insertAdjacentElement('beforebegin', t);
    else{
        treeElem.append(t);
    }
    return t;
}


function getTree(elem){
    return elem.classList.contains("w-tree") ? elem : (elem.querySelector(".w-tree") || null);
}
